<template>
	<view class="list">
		<public-module></public-module>
		<view class="u-page" >
			<u-list  v-if="indexList && indexList.length!=0" @scrolltolower="scrolltolower"  height="calc(100vh - 180rpx)">
				<u-list-item v-for="(item, index) in indexList":key="index">
					<view class="infos" @click="from_info(item.id)">
						<view class="infos-top">
							<u-avatar size="16" src="/static/staff/md.png"></u-avatar>
							<view  class="infos-top-title">
								{{store_name}}
							</view>
						</view>
						<view class="infos-lower">
							<view  class="infos-lower-title">
								{{item.created_at}}验光数据
							</view>
							<u-avatar size="26" src="/static/staff/jt.png"></u-avatar>
						</view>
					</view>
				</u-list-item>
			</u-list>			
			<u-empty mode="order" text="暂无眼光记录" v-else></u-empty>
		</view>
	</view>
</template>

<script>
	import base from '@/config/baseUrl';
	import { myFromList } from '@/config/api.js';
	export default {
		data() {
			return {
				indexList: [],
				statusBarHeight:30,
				// img:"https://cdn.uviewui.com/uview/album/1.jpg",
				page:1 ,//页数
				isOver:0, //是否加载完成
				isLoding:0,//是否正在加载
				store_name:'',
			};
		},
		onLoad() {
			this.loadmore()
		},
		methods: {
			scrolltolower() {
				this.loadmore()
			},
			loadmore() {
				
				let _this =this;
				if(_this.isOver ==1 || _this.isLoding ==1 ){return;}
				_this.isLoding = 1;
				let httpData={
					page:_this.page,
					user_id:_this.id
				};
				myFromList(httpData).then((res) => {
					_this.store_name = res.store_name
					_this.indexList = _this.indexList.concat(res.data.data);
					_this.isLoding = 0;
					if(_this.page >= res.data.last_page)
					{
						//加载完成
						_this.isOver = 1;
					}else{
						 _this.page = _this.page+1;
					}
				}).catch((err) =>{
					_this.isLoding = 0;
				})
			},
			from_info(id)
			{
				uni.navigateTo({
					url :'/pages/parameter/parameter?id='+id
				});
			}
		},
	}
</script>

<style lang="scss">
	.list{
		.bj{
			width: 750rpx;
			position: absolute;
			z-index: -10;
			height: 100vh;
			
			
		}
		.top{
			&-nav{
				text-align: center;
				color: #333333;
		
			}
			
		}
		.user{
			margin-top: 120rpx;
			margin-left:85rpx;
			&-name{
				color: #333333;
				font-size: 48rpx;
				
			}
			&-tel{
				color: #999999;
				font-size: 28rpx;
				display: flex;
				
			}
		}
		.u-page{
			box-sizing: border-box;
			margin-top: 30rpx;
			padding: 0 32rpx;
			.infos{
				box-sizing: border-box;
				border-radius:10rpx;
				margin-bottom: 20rpx;
				width: 686rpx;
				height: 182rpx;
				background-color: #fff;
				padding: 18rpx 32rpx 0 28rpx;
				&-top{
					display: flex;
					&-title{
						margin-left: 10rpx;
						color: #999999;
						font-size: 24rpx;
						
					}
					
				}
				&-lower{
					margin-top: 35rpx;
					display: flex;
					justify-content: space-between;
					&-title{
						font-size: 36rpx;
						color: #3D3D3D;
					}
				}
			}
			

		}
		.butall{
			background-color: #ffffff;
			width: 750rpx;
			height: 150rpx;
			position: absolute;
			bottom:0;
			lift:0;
			z-index: 10;
			.but{
				background-color: #33B37E;
				color: #fff;
				margin: 20rpx 150rpx 30rpx 150rpx;
				
			}
		}
	}

</style>
